<template>
  <div class="tabBox">
    <el-page-header @back="goBack" content="学校人员管理"></el-page-header>
    <br/>
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane v-if="this.menuList.includes('schoolPermission')" label="人员管理" name="personnel">
        <personnel></personnel>
      </el-tab-pane>
      <el-tab-pane v-if="this.menuList.includes('schoolRole')" label="角色管理" name="role">
        <role></role>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>
<script>
import personnel from './components/personnel'
import role from './components/role'
export default {
  components: {
    personnel,
    role
  },
  data () {
    return {
      menuList: [],
      activeName: 'personnel',
      activeList: ['personnel', 'role']
    }
  },
  created () {
    this.menuList = sessionStorage.getItem('list')
  },
  methods: {
    goBack () {
      this.$router.push({path: '/school'})
    },
    handleClick () {
      this.$cookies.set('activeName', this.activeName)
    }
  }
}
</script>
<style>
.el-tabs__content{
  padding: 10px 20px;
}
</style>
